
<template>
<div style="width: 80% ;text-align: center"  >
 <div style="margin-bottom: 30px"> 新增管理员</div>
  <el-form :inline="true" :model="form"  :rules="rules" ref="form" style="width: 90% "  label-width="100px">
    <el-form-item label="姓名" prop="username">
      <el-input v-model="form.username" rule placeholder="姓名" >请输入姓名</el-input>
    </el-form-item>
    <el-form-item label="电话" prop="phone">
      <el-input v-model="form.phone" placeholder="电话">请输入电话</el-input>
    </el-form-item>
    <el-form-item label="邮件">
      <el-input v-model="form.email" placeholder="邮件">请输入地址</el-input>
    </el-form-item>
  </el-form>
<div  style="text-align: center; margin-top: 30px">
  <el-button type="primary" @click="save('form')" size="medium"> 提交</el-button>
</div>
</div>
</template>

<script>
import request from "@/utils/request";
export default {
  name: "AddUser",
  data() {
    const checkphone=(rule,value,callback)=>{
      if (!value)
      {
        return callback(new Error('电话不能为空'));
      }
      if(!/^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(value))
      {
         callback(new Error('电话不合理'))
      }
      callback()
      };
    return {
      form: {
        username:'',
        phone:'',
        email:''
      },
      rules:
    {
      name:[
        { required: true, message: '请输入姓名', trigger: 'blur' },
        { min: 1, max: 255, message: '长度在 1 到 255 个字符', trigger: 'blur' }
      ]
    }

    }
  },

  methods:
      {
        save(formname)
        {
          console.log(this.form)
          this.$refs[formname].validate((valid) => {
            if (valid) {
              request.post('/admin/save',this.form).then(res => {
                if(res.code ==="200")
                {
                  this.$notify.success('新增成功')
                  this.form={
                    username:'',
                    phone:'',
                    email:''
                  }
                }
                else
                {
                  this.$notify.error('res.msg')
                }
              })

            } else {
              this.$notify.error('失败')
              console.log('error submit!!');
              return false;
            }
          })
        }

      }
  }
</script>
<style scoped>
</style>